<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1">
		<title>Marketing Kit - Mobile</title>
		<link rel="stylesheet" href="css/themes/Bootstrap.css">
		<link rel="stylesheet" href="css/jquery.mobile.structure-1.4.0.min.css" />
		<link rel="stylesheet" href="css/jquery.mobile.icons.min.css" />
		<script src="js/jquery-1.8.2.min.js"></script>
		<script src="js/jquery.mobile-1.4.0.min.js"></script>
		<script type="text/javascript" src="cordova.js"></script>
		<script>
			//global variable
			var version = localStorage.getItem('ls_lastversion');
			var compName = localStorage.getItem('ls_compname');
			var updateStatus = localStorage.getItem('ls_update');
			var compId = localStorage.getItem('ls_compid');
			
			var db = null;	
			
			//database connection
			init();
			
			$(document).ready(function(){
															
				$('#lableTitle').text(compName);						
				$('#labelGroup').text(getParam('name_id'));		
				
				$("#btnBack").click(function(){
					$.mobile.loading( 'show', {
						text: 'Loading to menu utama!',
						textVisible: true,
						theme: 'c',
						html: ""
					});
					window.location="menu_page.htm?sub_id=2";
				});
								
			});
			
			function getPage(newsId){
				$.mobile.loading( 'show', {
						text: 'Loading to detil berita!',
						textVisible: true,
						theme: 'c',
						html: ""
					});
				var catName = getParam('name_id');
				var param='news_id='+newsId+'&cat_name='+catName;
				window.location="dtl_berita.htm?"+param;
			}
			
			function getParam( name ){
				name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");  
				var regexS = "[\\?&]"+name+"=([^&#]*)";  
				var regex = new RegExp( regexS );  
				var results = regex.exec( window.location.href ); 
				if( results == null )
					return "";  
				else
					return results[1];
			}
			
			function onDeviceReady(){
				try{
					db = window.openDatabase("marketkit", "1.0", "Market Kit Database", 1000000);
														
					db.transaction(
						function(tx){
							var catId=getParam('cat_id');															
							var sql = 'select * from tb_news where cat_id='+catId+' order by datetime(newsdate) desc';	
							//alert('sql:'+sql);													
							tx.executeSql(sql, [], function (tx, result){
								var index = 0;
								for(var i=0;i<result.rows.length;i++){
									var obj = result.rows.item(i);
									var strLi = '<li data-icon="arrow-r"><a href="#" onclick="getPage('+obj.news_id+')">'+obj.title+'</a></li>';
									$('.listViewId').append(strLi);									
									index++;
								}	
								
								if(index==0){
									$('.listViewId').append('<li><strong style="color:red">Tidak ada data.</strong></li>');
								}
										
								$('#listViewId').listview('refresh');
									
							});
						}, function(err){
						
						}, function(){
							//alert('query get version ok');
						}
					);
											
				}catch(e){
					alert("error:"+e);
				}
			}
			
			function init(){
	   			document.addEventListener("deviceready",onDeviceReady, false);
	   		}
	   		
		</script>
	</head>
	<body>
		<div data-role="page" data-theme="c">
			<div data-role="header" data-position="inline">
				<a href="#" id="btnBack" name="btnBack" data-icon="arrow-l" data-theme="c">Back</a>	
				<h1 id="lableTitle">Marketing Kit - Mobile</h1>
			</div>
			<div id="contentId" data-role="content" data-theme="a">
				<ul id="listViewId" class="listViewId" data-role="listview" data-inset="true" data-divider-theme="c">
					<li data-role="list-divider"><strong id="labelGroup"></strong></li>
					
				</ul>								
			</div>
		</div>
	</body>
</html>